<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link href="/static/css/bootstrap.css" rel="stylesheet">
    <script type="text/javascript" src="/static/js/jquery-3.2.1.js"></script>
    <script src="/static/js/echarts.js"></script>
    <script>
        $(function () {
            //获取下拉框场馆
            $.post(
                "/main/getBuilt",
                function (arr) {
                    for(var i in arr){
                        $("[name='bid']").append("<option value='"+arr[i].bid+"'>"+arr[i].bname+"</option>")
                    }
                }
            )
            //获取下拉框项目类型
            $.post(
                "/main/getType",
                function (arr) {
                    for(var i in arr) {
                        $("[name='tid']").append("<option value='" + arr[i].tid + "'>" + arr[i].tname + "</option>")
                    }
                }
            )
            //获取下拉框场地
            $.post(
                "/main/getGround",
                function (arr) {
                    for(var i in arr) {
                        $("[name='gid']").append("<option value='" + arr[i].gid + "'>" + arr[i].gname + "</option>")
                    }
                }
            )
        })
        //增加行
        var i=0;
        function add(obj) {
            i++;
            var str='<span>\n' +
                '                开始时间:<input type="text" name="pricesList['+i+'].startTime">\n' +
                '                结束时间:<input type="text" name="pricesList['+i+'].endTime">\n' +
                '                单价:<input type="text" name="pricesList['+i+'].price">\n' +
                '                <input type="button" value="+" onclick="add(this)">\n' +
                '                <input type="button" value="-" onclick="del(this)"><br>\n' +
                '            </span>';
            $("#jg").append(str);
        }
        //删除行
        function del(obj) {
            $(obj).parent().remove();
        }
        //异步提交
        function insert() {
            $.post(
                "/main/add",
                $("form").serialize(),
                function (map) {
                    if(map.error!=""){
                        alert(map.error);
                    }else{
                        alert(map.success);
                        location.href="/main/list";
                    }
                }
            )
        }
    </script>
</head>
<body>
<center>
    <h1>增加页面</h1>
    <form>
        <input type="hidden" name="id" value="${id}">
        场馆:<select name="bid">
        <option value="">请选择</option>
    </select><br>
        项目类型:<select name="tid">
        <option value="">请选择</option>
    </select><br>
        场地:<select name="gid">
        <option value="">请选择</option>
    </select><br>
        <h2>场馆价格设置</h2>
        <div id="jg">
            <span>
                开始时间:<input type="text" name="pricesList[0].startTime">
                结束时间:<input type="text" name="pricesList[0].endTime">
                单价:<input type="text" name="pricesList[0].price">
                <input type="button" value="+" onclick="add(this)">
                <input type="button" value="-" onclick="del(this)"><br>
            </span>
        </div><br>
        <input type="button" value="增加" onclick="insert()">
    </form>
</center>
</body>
</html>
